<template>
  <div class="container">
  <table class="table table-hover table-bordered  table-sm text-center">
  
  	<thead>
  		<tr>
  			<th class="text-center">表头部分</th>
  			<th class="text-center">表头部分</th>
  			<th class="text-center">表头部分</th>
  			<th class="text-center">表头部分</th>
  		</tr>
  	</thead>
  
  
  	<tbody>
  		<tr>
  			<td class="active">table-active</td>
  			<td class="info">table-info</td>
  			<td class="warning">table-warning</td>
  			<td class="table-dark">table-dark</td>
  		</tr>
  
  		<tr>
  			<td class="light">table-light</td>
  			<td class="danger">table-danger</td>
  			<td class="primary">table-primary</td>
  			<td class="bordered">table-bordered</td>
  		</tr>
  
  		<tr class="active">
  			<td>表格内容</td>
  			<td>表格内容</td>
  			<td>表格内容</td>
  			<td>表格内容</td>
  		</tr>
  
  		<tr class="warning">
  			<td>表格内容</td>
  			<td>表格内容</td>
  			<td>表格内容</td>
  			<td>表格内容</td>
  		</tr>
  
  		<tr class="primary">
  			<td>表格内容</td>
  			<td>表格内容</td>
  			<td>表格内容</td>
  			<td>表格内容</td>
  		</tr>
  
  		<tr class="danger">
  			<td>表格内容</td>
  			<td>表格内容</td>
  			<td>表格内容</td>
  			<td>表格内容</td>
  		</tr>
  
  		<tr class="light">
  			<td>表格内容</td>
  			<td>表格内容</td>
  			<td>表格内容</td>
  			<td>表格内容</td>
  		</tr>
  	</tbody>
  </table>
  </div>
</template>
